<!doctype html>
<html>
<head>
<meta http-equiv="pragma" content="no-cache" />
<script src="../plugins/jquery/jquery-1.5.2.min.js"></script>
<script src="../plugins/roundabout/jquery.easing.min.js"></script>
<script src="../js/common/jquery.slideviewer.1.2.js"></script>
<style type="text/css">
/*preload classes*/
.svw {width: 50px; height: 20px; background: #fff  ;}
.svw ul {position: relative; left: -999em;}

/*core classes*/
.stripViewer { 
position: relative;
overflow: hidden; 
border: 5px solid #ff0000  ;  
margin: 0 auto;
}
.stripViewer ul { /* this is your UL of images */
margin: 0;
padding: 0;
position: relative;
left: 0;
top: 0;
width: 1%;
list-style-type: none;
}
.stripViewer ul li { 
float:left;
margin-left:10px;
}
/*.stripViewer ul li:first-child{margin-left:0px;}*/
.stripTransmitter {
overflow: auto;
width: 1%;
}
.stripTransmitter ul {
margin: 0;
padding: 0;
position: relative;
list-style-type: none;
}
.stripTransmitter ul li{
width: 20px;
float:left;
margin: 0 1px 1px 0;
}
.stripTransmitter a{
font: bold 10px Verdana, Arial;
text-align: center;
line-height: 22px;
background: #ff0000  ;
color: #fff  ;
text-decoration: none;
display: block;
}
.stripTransmitter a:hover, a.current{
background: #fff  ;
color: #ff0000  ;
}

/*tooltips formatting*/
.tooltip
{
padding: 0.5em;
background: #fff  ;
color: #000  ;
border: 5px solid #dedede  ;
}
.stripViewer b{position:absolute;height:355px;top:0;z-index:300;opacity: .5;background-color: #eee;}
.stripViewer .prev{width:140px;left:0;}
.stripViewer .next{width:140px;right:0;}
</style>
</head>
<body>
<div id="mycontainer">
<div id="mygalone" class="svw">
<ul id="touchable">
	<li><img alt="new Mikado logo 600 3D" src="01.jpg"></li>
	<li><a href="#"><img alt="Bell 412" src="14.jpg"></a></li>
	<li><img alt="Four bladed MaxiR with Bell 427 semiscale fuselage" src="maxirbell42703.jpg"></li>
	<li><img alt="MaxiR Bell 427" src="maxirbell42702.jpg"></li>
</ul>
</div>
</div>
<script type="text/javascript">
    $(window).bind("load", function() {
    $("div#mygalone").slideView({extendWidth:300,imgMargin: 10,showSlide:function(ind){
    	console.log(ind);
    }})
});
</script>
</body>
</html>